{% extends "layout.html" %}

{% block header %}
{% set active_page = "create_resource" %}
{% end %}

{% block bodyattrs %}
class="create-resource"
{% end %}

{% block body %}

<div class="span12">
    <div class="mb20" id="api-selection">

        {% if flash_messages %}{% for type, message in flash_messages %}
        <div class="alert alert-{{type}}">
          <button type="button" class="close" data-dismiss="alert">×</button>
          {% raw message %}
        </div>
        {% end %}{% end %}


        <label class="radio inline">
          <input type="radio" class="protocol" name="protocol" value="rest"{% if protocol == "rest" %} checked{% end %}> REST
        </label>
        <label class="radio inline input-medium">
          <input type="radio" class="protocol" name="protocol" value="rpc"{% if protocol == "rpc" %} checked{% end %}> RPC (XML, <span{% if not jsonrpc %} id="jsonrpc"{% end %} data-content='The JSON-RPC handler requires jsonrpclib library, which you can get at <a href="http://github.com/joshmarshall/jsonrpclib" target="_blank">http://github.com/joshmarshall/jsonrpclib</a>'>JSON</span>)</label>
        </label>
    </div>

    <form class="form-horizontal{% if protocol != 'rest' %} hidden{% end %}" method="post" id="rest-form">
      <fieldset>
        {% module xsrf_form_html() %}

        <div class="control-group">
            <label for="url_path">Url path</label>
            <input type="text" name="url_path" id="url_path" value="{% if protocol == 'rest' %}{{method_file.url_path}}{% end %}" class="input-xlarge" required placeholder="Example: user/jonh">
        </div>

        <div class="control-group">
            <label for="method">Method</label>
            <select name="method" id="method">
                {% for supported_method in handler.SUPPORTED_METHODS %}
                <option{% if protocol == 'rest' and supported_method == method_file.method %} selected="selected"{% end %}>{{supported_method}}</option>
                {% end %}
            </select>
        </div>

        <div class="control-group">
            <label for="category">Category</label>
            <input type="text" name="category" id="category" autocomplete="off" value="{{category}}" class="input-xlarge" placeholder="Example: Users">
        </div>

        <div class="tabbable" id="responses">
          <ul class="nav nav-tabs" id="response-tabs">
            <li id="add-response-li"><a href="javascript:void(0)" id="add-response">Add response</a></li>
          </ul>
          <div class="tab-content" id="response-tabs-content">
          </div>
        </div>

        <div class="line"></div>

        <div class="wmd-panel">
            <label>Description</label>
            <div id="wmd-button-bar"></div>
            <textarea class="wmd-input" id="wmd-input" name="resource_description">{% if protocol == 'rest' and method_file.description %}{{method_file.description}}{% end %}</textarea>
        </div>
        <div id="wmd-preview" class="wmd-panel wmd-preview"></div>

        <div class="control-group">
          <button type="button" class="btn" id="save-resource">Save</button>
        </div>
      </fieldset>
    </form>

    <form class="form-horizontal{% if protocol != 'rpc' %} hidden{% end %}" method="post" action="/__manage/create/rpc" id="rpc-form">
        <fieldset>
            {% module xsrf_form_html() %}

            <div class="control-group">
                <label for="method_name">Method name</label>
                <input type="text" name="method_name" id="method_name" value="{% if protocol == "rpc" %}{{method_file.name}}{% end %}" required class="input-xlarge" placeholder="Example: examples.getName">
            </div>

            <div class="control-group">
                <label for="rpc_category">Category</label>
                <input type="text" name="category" id="rpc_category" autocomplete="off" value="{{category}}" class="input-xlarge" placeholder="Example: Users">
            </div>

            <div class="control-group">
                <label>Method response <span class="text-warning" id="define-in-json" data-content='<b>Example:</b><br>{<br>"name": "Tomas",<br>"surname": "Hanacek"<br>}'>(Define in JSON)</span></label>
                <div id="method-response-editor"></div>
                <input type="hidden" name="method_response" id="method_response" />
            </div>

            <div class="wmd-panel">
                <label>Description</label>
                <div id="wmd-button-bar-rpc"></div>
                <textarea class="wmd-input" id="wmd-input-rpc" name="description">{% if protocol == 'rpc' and method_file.description %}{{method_file.description}}{% end %}</textarea>
            </div>
            <div id="wmd-preview-rpc" class="wmd-panel wmd-preview"></div>

            <div class="control-group">
              <button type="submit" class="btn">Save</button>
            </div>
        </fieldset>
    </form>
</div><!--/span-->
{% end %}

{% block javascripts %}
<script src="/__static/vendor/pagedown/js/Markdown.Converter.js" type="text/javascript" charset="utf-8"></script>
<script src="/__static/vendor/pagedown/js/Markdown.Sanitizer.js" type="text/javascript" charset="utf-8"></script>
<script src="/__static/vendor/pagedown/js/Markdown.Editor.js" type="text/javascript" charset="utf-8"></script>
<script src="/__static/vendor/ace/js/ace.js" type="text/javascript" charset="utf-8"></script>
<script src="/__static/js/create-resource.js" type="text/javascript" charset="utf-8"></script>
<script src="/__static/js/create-rest.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">

{% if protocol == "rest" %}
var manager = new CreateRestMethodManager({% raw SUPPORTED_FORMATS %});
{% for i, response in enumerate(method_file.responses) %}
var response = manager.addResponse();
response.setDefaults({% raw json_encode(response) %});
{% if i == 0 %}
response.show();
{% end %}
{% end %}

{% if not method_file.responses %}
var response = manager.addResponse();
response.show();
{% end %}
{% end %}

{% if protocol == "rpc" and method_file.method_response %}
methodResponseEditor.setValue({% raw json_encode(method_file.method_response) %});
{% end %}

var converter1 = new Markdown.Converter();
var editor1 = new Markdown.Editor(converter1);
editor1.run();

var converter2 = new Markdown.Converter();
var editor2 = new Markdown.Editor(converter2, "-rpc");
editor2.run();

$("#category").typeahead({source: {%raw json_encode(list(handler.api_data.categories))%}})

$("#rpc_category").typeahead({source: {%raw json_encode(list(handler.api_data.categories))%}})
</script>
{% end %}
